<template>
  <view class="swiper1-wrap">
    <view class="swiper1-index-banner">
      <view class="swiper">
        <swiper class="swiper-container" :autoplay="true" :interval="4000" :circular="true" :indicator-dots="true" indicator-active-color="#FC3F78"
          indicator-color="#cccccc">
          <block v-for="(item,index) in banner" :key="index">
            <swiper-item class="swiper-wrapper">
              <image :src="item.image" mode="widthFix"></image>
            </swiper-item>
          </block>
        </swiper>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      banner: [
        { image: '/static/swiper_list/2.jpg' },
        { image: '/static/swiper_list/2.jpg' },
        { image: '/static/swiper_list/2.jpg' }
      ]
    };
  },
  methods: {}
};
</script>

<style>
.swiper1-index-banner {
  width: 100%;
}

.swiper1-index-banner .swiper-container {
  height: 400rpx;
}

.swiper1-index-banner .swiper .swiper-container image {
  width: 100%;
}
</style>
